<template>
  <div class="allsearch">
    <section class="search-content">
      <el-row :gutter="4" type="flex" justify="start">
        <el-col :span="24">
          <el-select v-model="atype" placeholder="所有类型" style="width:120px" @change="handleFilter">
            <el-option
              v-for="item in type"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
          <el-select v-model="aword" placeholder="敏感词" style="width:120px" @change="handleFilter">
            <el-option
              v-for="item in word"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
          <el-input v-model="keyWord" placeholder="搜索关键字" style="width:200px" @keyup.enter.native="handleFilter"/>
          <el-button type="primary" @click="handleFilter">搜索</el-button>
          <el-button size="medium" type="info" @click="clearParams">清空</el-button>
        </el-col>
      </el-row>
    </section>
    <subtable
      :table-label="shieldLabel"
      :table-data="shieldData.slice((currentpage-1)*pagesize,currentpage*pagesize)"
    />
    <pagination
      :total="total"
      :current-page="currentpage"
      :page-size="pagesize"
      @handleSizeChange="handleSizeChange"
      @handleCurrentChange="handleCurrentChange"
    />
  </div>
</template>

<script>
import Subtable from '@/components/Eltable'
import Pagination from '@/components/Pagination' // 分页组件
import { getSensitiveHideLogList } from '@/api/operate/dictionaryItem' // 数据接口
import { getTenantId } from '@/utils/auth'
export default {
  components: {
    Subtable,
    Pagination
  },
  data() {
    return {
      total: 0,
      currentpage: 1,
      pagesize: 10,
      keyWord: '',
      aword: '',
      atype: '',
      shieldLabel: [
        {
          label: '编号', width: '', prop: 'id'
        }, {
          label: '命中敏感词', width: '', prop: 'sensitive'
        }, {
          label: '类型', width: '', prop: 'sensitiveTypeStr'
        }, {
          label: '屏蔽文本', width: '', prop: 'hideText'
        }, {
          label: '用户', width: '', prop: 'userName'
        }, {
          label: '屏蔽时间', width: '', prop: 'hideTimeStr'
        }, {
          label: 'IP地址', width: '', prop: 'ipAddress'
        }
      ],
      shieldData: [],
      listFilter: [],
      word: [
        {
          label: '敏感词',
          value: '敏感词'
        },
        {
          label: '编号',
          value: '编号'
        }
      ],
      type: [
        {
          label: '所有类型',
          value: ''
        },
        {
          label: '禁用',
          value: 'forbidden'
        },
        {
          label: '屏蔽',
          value: 'noSee'
        }
      ]
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    handleSizeChange(val) {
      this.currentpage = 1
      this.pagesize = val.value
      if (this.pagesize >= 20) {
        scrollTo(50, 800)
      }
    },
    handleCurrentChange(val) {
      this.currentpage = val.value
      if (this.pagesize >= 20) {
        scrollTo(50, 800)
      }
    },
    handleFilter() {
      this.shieldData = this.listFilter.filter(item => {
        if (this.atype && item.sensitiveType !== this.atype) return false
        if (this.aword === '敏感词' && item.sensitive.toLocaleLowerCase().indexOf(this.keyWord.toLocaleLowerCase()) === -1) return false
        if (this.aword === '编号' && item.id.toString().toLocaleLowerCase().indexOf(this.keyWord.toLocaleLowerCase()) === -1) return false
        return true
      })
      this.total = this.shieldData.length
    },
    clearParams() {
      this.atype = ''
      this.aword = ''
      this.keyWord = ''
      this.getData()
    },
    getData() {
      getSensitiveHideLogList().then(response => {
        this.shieldData = response.data.items.filter(item => {
          if (item.tenantId !== getTenantId()) return false
          return true
        })
        this.shieldData.map(item => {
          if (item.sensitiveType === 'forbidden') item.sensitiveTypeStr = '禁用'
          if (item.sensitiveType === 'noSee') item.sensitiveTypeStr = '屏蔽'
          if (item.hideTime) item.hideTimeStr = new Date((item.hideTime)).toLocaleString().replace(/[\u4e00-\u9fa5]/g, '')
        })
        this.total = this.shieldData.length
        this.listFilter = this.shieldData
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.allsearch {
  margin-top: 0px;
  padding: 0;
  .search-content {
    width: 100%;
  }
}
</style>
